<template>
	<view class="warp">
		<view class="content">
			<c-navBar title="认养亩数" isSeat></c-navBar>
			<view class="main">
				<p class="main-p1">认养亩数</p>
				<p class="main-p2">
					请您选择你需要认养的茶园亩数<br>
					普通庄主可认养1-10亩；<br>
					皇冠庄主最低认养10亩；<br>
					选择好认养亩数后生成合同并签署。
				</p>
				<view class="main-box">
					<p>茶园亩数（￥{{price}}/亩）</p>
					<view class="main-add">
						<image @click="reduceNumber" style="width: 40rpx;height: 36rpx;" src="../static/reduce-icon.png"
							mode=""></image>
						<text class="add-font">{{num}}</text>
						<image @click="addNumber" style="width: 40rpx;height: 36rpx;" src="../static/add-icon.png"
							mode=""></image>
					</view>
				</view>
				<view class="main-box" style="margin-top: 20rpx;">
					<input placeholder="输入推荐码（选填）" type="text" style="font-size: 28rpx;width: 100%;"
						v-model="code"></input>
				</view>

			</view>

		</view>
		<view class="foot">
			<p class="footP">共计：<text style="color: #EE3B31;">￥{{price * num}}</text></p>
			<view class="foot-box" @click="goAgreement">
				生成合同
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				num: 1, //数量
				price: '', //价格
				code: '', //邀请码
				type: '', //会员类型
			}
		},
		onLoad(options) {
			this.price = options.price
			this.type = options.type
			if (this.type == 2) {
				this.num = 10
			} else {
				this.num = 1
			}
			console.log(options, "价格");
		},
		methods: {
			//减少
			reduceNumber() {
				if (this.type == 2) {
					if (this.num > 10) {
						this.num--
					} else {
						uni.showToast({
							title: '皇冠庄主单次认养亩数不低于10亩',
							icon: 'none',
							duration: 1000
						})
					}

				} else {
					if (this.num > 1) {
						this.num--
					}
				}

			},
			// 增加
			addNumber() {
				if (this.type == 1) {
					if (this.num == 10) {
						uni.showToast({
							title: '普通庄主单次认养亩数不超过10亩',
							icon: 'none',
							duration: 1000
						})
					} else {
						this.num++
					}

				} else {
					this.num++
				}

			},
			// 生成合同
			goAgreement() {
				// uni.navigateTo({
				// 	url: `/pages/tabbar/agreement?type=3`
				// })
				uni.showLoading({
					mask:true
				})
				this.$api.checkData({
					"code": this.code,
					"num": this.num,
					"type": this.type
				}).then(res => {
					this.urlPdf = res.data
					// console.log(res, "生成合同");
					uni.navigateTo({
						url: `/pages/tabbar/agreement?urlPdf=${res.data}&&type=3&&num=${this.num}&&code=${this.code}&&memberType=${this.type}`
					})
					uni.hideLoading()
				})

			}
		}

	}
</script>

<style lang="scss" scoped>
	input::-webkit-input-placeholder {
		/* WebKit browsers */
		font-size: 28rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		color: #999999;
	}

	.warp {
		width: 100vw;
		min-height: 100vh;
		padding-top: 200rpx;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		justify-content: space-between;

	}

	.main {
		width: 710rpx;
		margin: 0 auto;

		.main-p1 {
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			color: #1A1A1A;
		}

		.main-p2 {
			font-size: 28rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #666666;
			padding: 20rpx 0rpx 32rpx;
			box-sizing: border-box;
		}

		.main-box {
			width: 710rpx;
			height: 96rpx;
			background: #F7F7F7;
			border-radius: 12rpx 12rpx 12rpx 12rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0rpx 20rpx;
			box-sizing: border-box;


			.main-add {
				display: flex;
				align-items: center;
				justify-content: space-between;
				height: 36rpx;
				width: 140rpx;

				.add-font {
					font-size: 32rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: bold;
					color: #333333;
				}
			}
		}
	}

	.foot {
		width: 750rpx;
		height: 128rpx;
		background: #FFFFFF;
		border-top: 1rpx solid #E6E6E6;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0rpx 32rpx;
		box-sizing: border-box;

		.footP {
			font-size: 36rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			color: #343840;
		}

		.foot-box {
			width: 320rpx;
			height: 80rpx;
			background: linear-gradient(135deg, #2AD03D 0%, #00B815 100%);
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			font-size: 36rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}
</style>